{include file="public/header,public/nav,public/fixbar" title="资讯列表-<?php echo request()->pc_info['seo_title']?>"/}
<style>
    .layui-table-cell {
        line-height: unset;
        padding: 5px 10px;
    }
</style>
<div class="layui-body">
    <div class="layui-container">
        <div class="layui-main margin-bottom-10">
            <div class="layui-row">
                <div class="goods-category-select">
                    <div class="category-list">
                        <div id="second-category">
                            <a class="layui-btn layui-btn-primary second-category layui-this" data-secondid="0">全部</a>
                            {foreach $second_category as $v}
                            <a class="layui-btn layui-btn-primary second-category" href="javascript:;" data-secondid="{$v.id}">{$v.name}</a>
                            {/foreach}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-space15">
            <div class="layui-col-xs12 layui-col-md7 layui-col-lg8">
                <div class="layui-main min-height-65vh">
                    <div class="layui-row">
                        <table class="layui-hide" id="tableList" lay-filter="tableList"></table>
                        
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-md5 layui-col-lg4">
                <div class="layui-main margin-bottom-15">
                    <div class="layui-row">
                        <div class="layui-font-16 margin-bottom-15 font-weight-bold">
                            <i class="layui-icon layui-icon-fire layui-font-16 padding-right-5 layui-font-red"></i>
                            热门课程
                        </div>
                        <div class="layui-col-space15">
                            {foreach $course_list as $v}
                            <div class="layui-col-xs12 article-li">
                                <a href="{$v.href}">
                                    <div class="layui-card">
                                        <div class="layui-card-body">
                                            <div class="item">
                                                <img src="{$v.head_imgs}" class="user-course-img">
                                                <div class="detail">
                                                    <div class="product-title layui-ellips">
                                                        <span class="item-title-label">{$v.product_type_text}</span>{$v.name}
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="layui-card-footer">
                                            <p class="text">已有 <b>{$v.virtual_sales+$v.real_sales}</b> 人学习</p>
                                            {if $v.sale_price == 0}
                                            <p class="product-price layui-font-16">免费</p>
                                            {else}
                                            <p class="product-price layui-font-16"><span class="symbol">￥</span>{$v.sale_price}</p>
                                            {/if}
                                        </div>
                                    </div>
                                </a>
                            </div>
                            {/foreach}
                        </div>
                    </div>
                </div>
            </div>
        </div>
        
    </div>
</div>
{include file="public/footer"/}
<script type="text/javascript">
    layui.use(['table','element'], function(){
        var $ = layui.jquery, table = layui.table, element = layui.element;

        // 绑定自定义的 tab 元素
        element.tab({
            headerElem: '#second-category>.layui-btn',
        });

        var category_id = 0;
        $(document).on('click','.second-category',function(){
            category_id = $(this).data('secondid');
            table.reloadData('listReload', {
                where: {
                    category_id: category_id,
                },
                page: {
                    curr: 1 //重新从第 1 页开始
                },
            }); // 加载列表
        });

        var tableInfo = table.render({
            elem: '#tableList',
            url:'/article/index',
            method: 'post',
            lineStyle: 'height: 95px;',
            height: 'full-155',
            defaultToolbar: [],
            cols: [[
                {field:'', title:'', align: 'left', templet: function(d){
                    var html = `<div class="layui-col-xs12 article-li">
                                    <a href="/article/detail?id=${d.id}">
                                        <div class="layui-card" style="border: none;border-bottom: 1px solid #f2f2f2;">
                                            <div class="layui-card-body">
                                                <div class="article-content">
                                                    <div class="detail layui-ellip">
                                                        <div class="product-title layui-ellip">${d.title}</div>
                                                        <div class="article-tool">
                                                            <p class="time"><i class="layui-icon layui-icon-time"></i> ${d.create_time}</p>
                                                            <p class="text"><i class="layui-icon layui-icon-eye"></i> ${d.click_num}</p>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </a>
                                </div>`;
                    return html;
                }}
            ]],
            id: 'listReload',
            limits: [10, 20, 30, 50],
            limit: 10,
            page: true,
            where: {'category_id':category_id},
            done: function (res, curr, count) {
                if (res.code == 0) {
                    $(".layui-table-header").find('tr').addClass('layui-hide');
                } else {
                    layer.msg(res.msg,{icon: 2});
                }
            },
            text: {
                none: '<div class="layui-empty"><img src="/static/images/nodata/no_search.png"><p>暂无相关数据~</p></div>'
            }
        });
    });
</script>